<template>
    <div class="com-cnt" style="position:relative">
        <div class="header">
            <span class="title_mx">邀请记录</span>
        </div>
        <div class="box">
            <div class="bars">
                <div class="goodfirend">
                    <div class="qr_code_pic">
                        <!-- <h5>
                            已邀请人数
                            <span id="num">0</span>
                            （人）
                        </h5> -->
                        <!-- <img src="http://hf-resource.oss-cn-shanghai.aliyuncs.com/xwh/20180704143142.jpg" /> -->
                        <img :src="businessLicense" style="margin-top: 15px;"/>
                        <p>专属邀请码</p>
                    </div>
                </div>
                <div class="qr_code_path">
                    <input name="company" type="text" v-model="company" />
                    <button @click="copyText">复制邀请链接邀请好友</button>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import { domain } from '@/assets/js/config'
import http from "@/assets/js/axios"
import axios from 'axios'
import Qs from 'qs'
import $ from 'jquery'
import { maskTips } from '@/assets/js/dom'
export default {
    name: 'yqhyPage',
    components: {
    },
    data() {
        return {
            businessLicense: '',
            company: ''
        }
    },
    mounted() {
        var userToken = localStorage.getItem('token')
        var that = this
        if (!userToken) {
            that.$router.push('/login')
        }
        $.ajax({
            type: "POST",
            url: domain + "/xshk/f/user/toQRCode?token=" + userToken,
            data: { mobile: that.yhkbdsjh, bankId: that.yhkh, userName: that.sfzxm, idCard: that.sfzkh },
            dataType: "JSON",
            success: function (data) {
                var code = data.code;
                var message = data.message; 
                console.log(data)
                if (code === 0) {
                    that.company = data.data.company
                    that.businessLicense = data.data.businessLicense
                } else if (code === -5) {
                    maskTips({ id: "login-error", txt: data.message })
                    that.$router.push('/login')
                }
            }
        });
        $.ajax({
            type: "POST",
            url: domain + "/xshk/f/user/invite?token=" + userToken,
            dataType: "JSON",
            success: function (data) {
                console.log(data.data);
                if(data.data == undefined){
                    $("#num").text('0');
                    $('.title_mx').click(function(){
                        window.location.href = 'wjl'
                    });
                }else{
                    $("#num").text(data.data.length);
                    $('.title_mx').click(function(){
                        window.location.href = 'yqjl'
                    })
                };
                if(data.data == undefined){
                    data.data = []
                }
                if(data.data.length != 0){
                    $("#num").text(data.data.length);
                    $('.title_mx').click(function(){
                        window.location.href = 'yqjl'
                    });
                }else{
                    $("#num").text('0');
                    $('.title_mx').click(function(){
                        window.location.href = 'wjl'
                    })
                };
                
                
            }
        });

    },
    methods: {
        direct: function (val) {
            this.$router.push({ path: "/" + val });
        },
        copyText: function () {
            var input = $("input[name='company']")
            input.select()
            document.execCommand("copy")
            maskTips({ id: "take-succ", txt: "获取邀请码成功" })
        },
    }
}
</script>

<style lang="stylus" scoped>
.com-cnt {
    width: 100%;
    height: 100%;
}

.header {
    /* height: 0.92rem; */
    position: absolute;
    z-index: 9999;
    right: 0.34rem;
    top: 0.34rem;
    font-size: 0.27rem;
}

.box {
    width: 100%;
    height: 100%;
    padding-top: 1.5rem;
    box-sizing: border-box;
    background: #aad114;
}

.bars {
    width: 80%;
    height: 0.44rem;
    margin: 0 auto;
    background: #222;
    border-radius: 50px;
    position: relative;
    border: 6px solid #cb8262;
}

.goodfirend {
    position: absolute;
    top: 0.1rem;
    left: 0.16rem;
    background: #fff;
    width: 95%;
}

.qr_code_pic {
    width: 95%;
    margin: 0 auto;
    font-size: 0.48rem;
    color: #574841;
    text-align: center;
}

.qr_code_pic h5 {
    margin-top: 0.5rem;
}

.qr_code_pic p {
    font-size: 0.4rem;
    margin-bottom: 0.4rem;
}

.qr_code_pic img {
    width: 100%;
}

.qr_code_path {
    position: absolute;
    top: 6.5rem;
    left: 0.16rem;
    width:100%;
}

.qr_code_path input {
    width: 90%;
    font-size: 16px;
    height: 0.6rem;
    border: 1px solid #dbcd8e;
    border-radius: 5px;
    margin: .2rem 0.2rem;
    padding: 0 0.2rem;
    box-sizing: border-box;
}

.qr_code_path button {
    padding: 0 0.4rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
    border: none;
    color: #f2f2f2;
    background: #f93;
    font-size: 0.3rem;
    height: 0.8rem;
    border-radius: 0.5rem;
    margin: 0.2rem 0.5rem;
    width: 80%;
}
</style>